<template>
  <div>
    <el-table :data="list" style="width: 100%">
      <el-table-column prop="id" label="ID" width="180" />
      <el-table-column prop="shopAddress" label="名称" width="180" />
      <el-table-column prop="shopDescription" label="地址" />
      <el-table-column prop="shopImage" label="图片">
        <template #default="{ row }">
          <!-- <img :src="row.shopImage" alt="" style="width:80px"> -->
          <el-image style="width: 100px; height: 100px" :src="row.shopImage" :zoom-rate="1.2" :max-scale="7"
            :min-scale="0.2" :preview-src-list="srcList" :initial-index="4" fit="cover" />
        </template>
      </el-table-column>
    </el-table>
  </div>

</template>
<script setup>
import axios from 'axios';
import { ref } from 'vue';

const list = ref([])
const srcList = ref([])
const _getData = () => {
  axios.get('/api/list').then(res => {
    console.log(res);
    list.value = res.data.data.data
  })
}
_getData()
</script>